<template>
	<view>
		<view class="mainpadding topimg" style="padding-bottom: 120rpx;" v-if="!is_login">
			<view class="flexbetween" @click="jumpurl('/pages/login/applogin')">
				<view class="flexleft">
					<image src="@/static/image/system/weidenglu.png" class="headimg margin_right3" mode=""></image>
					<view class="titletext xiaobai bold">未登录，点击登录</view>
				</view>
				<u-icon name="arrow-right" color="#fff" size="24"></u-icon>
			</view>
		</view>
		<view class="mainpadding topimg" style="padding-bottom: 120rpx;" v-if="is_login"
			@click="jumpurl('/pages/mine/gerenxx')">
			<view class="flexbetween" style="align-items: flex-start;">
				<view class="flexleft">
					<image :src="userInfo.avatar_text" class="headimg margin_right3" mode=""></image>
					<view class="">
						<view class="titletext xiaobai bold">{{userInfo.nickname}}</view>
						<view class="xiaobai smalltext margin_top1">手机号：{{userInfo.mobile}}</view>
						<view class="xiaobai smalltext margin_top1">邀请码：{{userInfo.invite_code}}</view>
					</view>
				</view>
				<!-- <u-icon name="setting" color="#fff" size="24"></u-icon> -->
			</view>
			<view class="flexbetween" style="align-items: flex-start;"
				v-if="userInfo.join_appname || userInfo.join_apppassword"
				@click.stop="copy(userInfo.join_appname+' '+userInfo.join_apppassword)">
				<view class="headimg margin_right3"></view>
				<view class="topcontent flexbetween margin_top1" style="width: 100%;">
					<view class="">
						<view class="xiaobai smalltext">入件App用户名：{{userInfo.join_appname}}</view>
						<view class="xiaobai margin_top1 smalltext">密码：{{userInfo.join_apppassword}}</view>
					</view>
					<view class="xiaobai smalltext">复制</view>
				</view>
			</view>
		</view>
		<view class="mainpadding2">
			<view class="tixianbox mainpadding ffffff radius" @click="jumpurl('/pages/mine/yue')">
				<view class="flexbetween">
					<view class="xiaohui titletext">可提现余额</view>
					<view class="listbtn">提现</view>
				</view>
				<view class="xiaohei bold" style="font-size: 45rpx;">{{userInfo?userInfo.money:0}}</view>
			</view>
		</view>
		<view class="mainpadding" style="position: relative;top: -100rpx;">
			<view class="ffffff radius" style="border-radius: 16rpx; padding: 40rpx 30rpx;">
				<!-- <view class=" flexbetween pdl" @click="jumpurl('/pages/mine/shezhi')">
					<view class="flexleft">
						<u-icon name="man-add" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">服务订单</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view> -->
				<view class="flexbetween pdl" @click="shiming()">
					<view class="flexleft">
						<u-icon name="pushpin" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">实名认证</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
				<view class="flexbetween margin_top4 pdl" @click="jumpurlfn('/pages/system/system?type=1')">
					<view class="flexleft">
						<u-icon name="pushpin" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">用户协议</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
				<view class="flexbetween margin_top4 pdl" @click="jumpurlfn('/pages/system/system?type=2')">
					<view class="flexleft">
						<u-icon name="pushpin" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">隐私政策</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
				<view class="flexbetween margin_top4 " :class="is_login?'pdl':''"
					@click="jumpurl('/pages/mine/yinhangk')">
					<view class="flexleft">
						<u-icon name="coupon" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">我的银行卡</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
				<view class="flexbetween margin_top4" v-if="is_login" @click="zxshow=true">
					<view class="flexleft">
						<u-icon name="error-circle" size="19" color="#3B50FF"></u-icon>
						<view class="titletext hei_text bold margin_left3">账号注销</view>
					</view>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
			</view>
		</view>
		<view class="gudingdb mainpadding" style="bottom: 150rpx;" v-show="is_login" @click="outlogin">
			<view class="bigbtn">退出登录</view>
		</view>
		<u-modal title='警告' :show="zxshow" content="账号注销后，您的系统数据将不再可用。请慎重处理!!!" @confirm="zxconfirm"
			style='text-align: center;' confirmColor="#999" confirmText="确认注销" cancelText="再想想" cancelColor="#2361FF"
			buttonReverse showCancelButton @cancel='zxshow=false'></u-modal>
		<u-modal :show="show" cancelColor="#555" confirmColor="#2361FF" :showCancelButton="true" title="确定要退出当前账户么？"
			@cancel="show=false" @confirm="confirm"></u-modal>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				userInfo: {},
				is_login: false,
				show: false,
				title: '确定要退出当前账户么？',
				zxshow: false
			}
		},
		onShow() {
			this.is_login = httpRequest.checkIsLogin();
			if (this.is_login) {
				this.init()
			} else {
				this.userInfo = null
			}
		},
		methods: {
			outlogin() {
				httpRequest.modal('提示', '确定要退出当前账户么', true, (resp) => {
					if (resp) {
						uni.clearStorageSync()
						httpRequest.toast("退出登录成功")
						this.userInfo = null
						this.is_login = false
					}
				})
			},
			// showtrue() {
			// 	this.show = true
			// },
			shiming() {
				if (this.userInfo.smrz == null) {
					uni.navigateTo({
						url: "/pages/mine/shimingrz"
					})
				} else {
					uni.navigateTo({
						url: '/pages/mine/shenhe'
					})
				}
			},
			zxconfirm() {
				this.zxshow = false;
				httpRequest.request('/api/user/zxUser', 'POST', {}, false, false, true).then(res => {
					httpRequest.toast(res.msg);
					if (res.code == 1) {
						uni.clearStorageSync()
						this.userInfo = null
						this.is_login = false
					}
				})
			},
			confirm() {
				this.show = false;
				// 将存储的数据改为空达到退出登录的效果
				uni.clearStorageSync()
				httpRequest.toast("退出登录成功")
				this.userInfo = null
				this.is_login = false
			},
			init() {
				httpRequest.request('/api/user/index', 'GET', {}).then(res => {
					if (res.code == 1) {
						this.userInfo = res.data
					} else {
						this.userInfo = null
					}

				})
			},
			jumpurl(url) {
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/applogin"
					})
					return false
				}
				uni.navigateTo({
					url
				})
			},
			jumpurlfn(url) {
				uni.navigateTo({
					url
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.topimg {
		background-image: url("@/static/image/system/topimg.png");
		background-size: 100% 500rpx;
		background-repeat: no-repeat;
	}

	.headimg {
		width: 120rpx;
		min-width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
	}

	.topcontent {
		padding: 15rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		border: 1rpx solid rgba(255, 255, 255, 0.6);
	}

	.tixianbox {
		position: relative;
		top: -100rpx;
	}

	.pdl {
		padding-bottom: 30rpx;
		border-bottom: 1rpx solid rgba(0, 0, 0, .03);
	}
</style>